<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro" >
<head>
	<meta charset="utf-8">
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no,shrink-to-fit=no">
	<meta name="theme-color" content="#000000">
	<meta name="format-detection" content="telephone=no">
	<meta name="format-detection" content="email=no">
	<meta name="viewport" content="width=device-width,initial-scale=1">
	<link rel="shortcut icon" href="favicon.ico">
	<title>房贷项目</title>
	<link rel="stylesheet" href="/js/plugin/layui-v2.3.0/layui/css/layui.css">
	<link rel="stylesheet" href="/css/reset.css">
	<link rel="stylesheet" href="/css/client.css">
	<link rel="stylesheet" href="/css/index.css">
	<script src="/js/jquery-2.1.1.min.js"></script>
	<script src="/js/plugin/layui-v2.3.0/layui/layui.js"></script>
	<style type="text/css">
	.layui-tab-title .layui-badge, .layui-tab-title .layui-badge-dot {
    left: 30px;
    top: 18px;
    border-radius:50%;
}
	</style>
</head>
<body>
	<input type="hidden" id="projectId" name="projectId" value="" />
	<div class="layui-layout layui-layout-admin" style="top: 0; bottom: 0;left: 0;right: 0;position: absolute;">
		<div class="layui-header my-header layui-tab layui-tab-brief"  lay-filter="headerNav">
			<div class="layui-logo "><img src="images/jintai_logo.png" alt="logo"></div>
			<!-- 头部区域（可配合layui已有的水平导航） -->
		    <ul class="layui-nav layui-layout-left layui-tab-title " >
		    
			    <shiro:hasPermission name="home:view">
					<li class="layui-nav-item" lay-id="projectIndex"><a href="#projectIndex">首页</a></li>
			    </shiro:hasPermission>
				
				<shiro:hasPermission name="user:view">
					<li class="layui-nav-item" lay-id="employee"><a href="#employee">员工</a></li>
				</shiro:hasPermission>
				
				<shiro:hasPermission name="statistic:view">	
					<li class="layui-nav-item" lay-id="statistic"><a href="#statistic">统计</a></li>
				</shiro:hasPermission>
				
				<shiro:hasPermission name="setting:view">
			      	<li class="layui-nav-item setting" lay-id="setting"><a href="#setting"><i class="layui-icon" style="font-size:17px">&#xe716;</i></a></li>
				</shiro:hasPermission>
			
		      <li class="layui-nav-item message" lay-id="msg"><a href="#msg"><i class="layui-icon" style="font-size:18px">&#xe667;</i> <span class="layui-badge" id="msgCount"></span></a></li>
		    </ul>
		    <ul class="layui-nav layui-layout-right my-header-pic">
		      <li class="layui-nav-item">
		        <a href="javascript:;">
		        <img th:if="${user.sysAttachmentPortrait!=null}" th:src="|${user.sysAttachmentPortrait.filePath}${user.sysAttachmentPortrait.id}${user.sysAttachmentPortrait.fileType}|"  class="layui-nav-img">
				<img th:if="${user.sysAttachmentPortrait==null}" src="/images/132.png"  class="layui-nav-img">
		        </a>
		        <dl class="layui-nav-child">
		          <dd><a href="javascript:;" onclick="set()">设置</a></dd>
		          <dd><a href="javascript:;" onclick="logOut()">退出</a></dd>
		        </dl>
		      </li>
		    </ul>
		</div>
 		<div class="layui-body">
 		<div style="position: relative;">
			<div class="sub-nav-bar1">
				<div style="position: relative;">
					<div class="bar-address" >
						<a href="javascript:void(0)">
							<span id="projectName"></span>
							<i class="layui-icon layui-icon-right shop-down"></i>
						</a>
					</div>
					<div class="bar-drop-down hide">
						<div class="city-list">
							<ul class="company-name clear-fix" id="projectList">
							</ul>
						</div>
					</div>
				</div>
			</div>
		</div>
		    <div class="iframe-wrap" id="iframe-wrap">
		    	<!-- <iframe id="index-iframe" src="" frameborder="0" width="100%" height="100%"></iframe> -->
		    </div>
		</div>
	</div>
</body>
<div class="form-wrap" style="display:none" id="power-formwrap">
	<form class="layui-form" action="" lay-filter="power-form">
		<div class="layui-form-item">
			    <label class="layui-form-label"><span class="must-fill">*</span>分店</label>
			    <div class="layui-input-block">
			      <select name="shop" xm-select="shop" xm-select-skin="normal" lay-filter="shop">
			      </select>
			    </div>
		</div>
		<div class="layui-form-item">
			    <label class="layui-form-label"><span class="must-fill">*</span>角色</label>
			    <div class="layui-input-block">
			      <select name="role" xm-select="role" xm-select-skin="normal" lay-filter="role">
			      </select>
			    </div>
		</div>
		<div class="layui-form-item" style="position: fixed;">
			    <div class="layui-input-block">
			      <button class="layui-btn layui-btn-normal" lay-filter="formEmployee" >取消</button>
			      <button type="" class="layui-btn layui-btn-primary" id="submit-btn" lay-submit >保存</button>
			    </div>
		</div>
	</form>	
	<input type="hidden" id="dataId" name="dataId" value="all"/>
<shiro:hasPermission name="project:create"> 
	<input type="hidden" id="project_create" value="1"/>
</shiro:hasPermission>
</div>
<script>
//切换分店
var toggle=true;
	$(function(){
		
		getProject();
		
		window.addEventListener("popstate", function(e) { 
				 getHash();	 
		}, false);
		layui.use(['element','layer','table'], function(){
			var element = layui.element, layer=layui.layer;
			  //获取hash来切换选项卡，假设当前地址的hash为lay-id对应的值，头部的导航
			  element.on('tab(headerNav)', function(data){
			    var layid = this.getAttribute('lay-id');
			    location.hash = layid;
			    getHash()//根据路由，显示当前内容
			  }); 
		  
		});
		//切换分店
		//toggle=true;
		$(".bar-address").on("click",function(event){
			preventBubble(event)
			var num = $("#projectList li").length;
			$("#projectList li").show();
			var id=$(this).children().children("span").attr("id");
			var list=$("#projectList").children("li");
			for(var i=0;i<list.length;i++){
				var idList=list[i].getAttribute("id");
				list[i].style.display="block";
				if(idList==id){
					list[i].style.display="none";
				}
			}
			if(num>1){
				if(toggle){
					$(this).children().children("i").addClass("layui-icon-down").removeClass("layui-icon-right");
					$(this).next().addClass("show").removeClass("hide");
					toggle=false;
				}else{
					$(this).children().children("i").addClass("layui-icon-right").removeClass("layui-icon-down");
					$(this).next().addClass("hide").removeClass("show");
					toggle=true;
				}
			}
		})
		//赋值分店
		$('.sub-nav-bar1').on("click","li",function(event){
			var txt=$(this).text();
			var id=$(this).attr("id");
			if(id == "addProject"){
				/* toggle=true;
				getHash(); */
				addProject(1);
			}else{
				$("#projectId").val(id);
				$(".bar-address").children().children('span').text(txt);
				$(".bar-address").children().children('span').attr('id',id);
				$(".bar-address").children().children("i").addClass("layui-icon-right").removeClass("layui-icon-down");
				$(".bar-drop-down").addClass("hide").removeClass("show");
				toggle=true;
				getHash();
			}		
		})
	})
	function getHash(){
		var layid = location.hash.substr(1),iframeSrc="",hashId='';
		var projectId = $("#projectId").val();
		$(".sub-nav-bar").hide();
		$(".layui-tab-title li[lay-id]").removeClass("layui-this");
		if(layid==""||layid=='undefined'||layid==null||layid.indexOf("projectIndex")!= -1){//首次进来，项目
			iframeSrc='/app/project/indexSecond/'+projectId;
			$('.sub-nav-bar1').show();
			layid="projectIndex";
		}
		if(layid=='team'){//团队
			iframeSrc='/app/customerTeam/list/'+projectId;
			$('.sub-nav-bar1').show();
		}else if(layid=='station'){//工位
			iframeSrc='/app/projectStation/index';
			$('.sub-nav-bar1').show();
		}else if(layid=='contract'){//合同
			iframeSrc='/app/contractInfo/index';
			//$('.sub-nav-bar1').hide();
		}else if(layid=='field'){//场地
			iframeSrc='/app/projectField/index';
			$('.sub-nav-bar1').show();
		}else if(layid=='door'){//门禁
			iframeSrc='/app/projectDoor/index';
			$('.sub-nav-bar1').show();
		}else if(layid=='visit'){//访客
			iframeSrc='/app/customerVisit/index';
			$('.sub-nav-bar1').show();
		}else if(layid.indexOf("employee")!= -1){//员工管理
			iframeSrc='/system/org/user/index';	
			$('.sub-nav-bar1').hide();
		}else if(layid=='crm'){//客户管理	    	
	    	iframeSrc='/app/customerInfo/list';	
	    	//$('.sub-nav-bar1').hide();
		}else if(layid =='setting'){//空间设置
			iframeSrc='/app/project/setting';
			$('.sub-nav-bar1').show();
		}else if(layid=='msg'){//消息
			iframeSrc='/app/message/list';
			$('.sub-nav-bar1').hide();
		}else if(layid=='statistic'){//统计
			iframeSrc='/app/statistical/index';
			//$('.sub-nav-bar1').hide();
		}else if(layid=="plan"){
			iframeSrc='/app/projectPartition/plan/'+projectId;
			layid='station';
		}else if(layid=='planList'){
			iframeSrc='/app/projectStation/index';
			layid='station';
		}
		
		
		
		//二级导航页面路径的配置；
		if(layid.indexOf("employeeDetials")!= -1){//员工管理-员工的详情页面
			hashId=layid.substring(layid.indexOf("/")+1);
			iframeSrc="/system/org/user/details/"+hashId;
			layid='employee';
			
		}
	    
		$(".layui-tab-title li[lay-id='"+layid+"']").addClass("layui-this");
		var iframe = document.createElement('iframe');//动态创建iframe，禁止iframe的src回退；
	    iframe.src = iframeSrc;
	    iframe.width = '100%';
	    iframe.height = '100%';
	    iframe.id= 'iframe-top';
	    $(".iframe-wrap").html($(iframe));
		//$("#index-iframe").attr("src",iframeSrc);	
	    $('.layui-body').css("top","54px");
		$('.my-header').show();
	}
	function set(){
		iframeSrc='/system/org/user/toSetIndex';	
		var iframe = document.createElement('iframe');//动态创建iframe，禁止iframe的src回退；
	    iframe.src = iframeSrc;
	    iframe.width = '100%';
	    iframe.height = '100%';
	    iframe.id= 'iframe-top';
	    $(".iframe-wrap").html($(iframe));
	}
	function logOut(){
		location.href="/logout";
	}
	function setSrc(iframeSrc){
		var iframe = document.createElement('iframe');//动态创建iframe，禁止iframe的src回退；
	    iframe.src = iframeSrc;
	    iframe.width = '100%';
	    iframe.height = '100%';
	    $(".iframe-wrap").html($(iframe));
	}
	//封装获取数据
	function getProject(){
	　	var url="/app/project/listdata";
		jQuery.ajax({
	        type:"post",
	        async:false,
	        url:url,
	        dataType:"json",
	        data:{},
	        success:function(data){
	        	var con="";
	        	if(data.data.length > 0){
		        	for (var i = 0; i < data.data.length; i++) {
		        		if(data.data.length==1){
		        			$(".shop-down").hide();
		        		}
		        		if(i==0){
		        			$("#projectName").html(data.data[i].projectName);
		        			$("#projectName").attr("id",data.data[i]['id'])
		        			$("#projectId").val(data.data[i].id);
		        		}
		        			con+='<li id="'+data.data[i].id+'"><a href="javascript:void(0)">'+data.data[i].projectName+'</a></li>';
	        		}
		        	if($("#project_create").val()==1){//分店新增根据权限显示
			        	con+='<li id="addProject"><a href="javascript:void(0)"><i class="layui-icon">&#xe654;</i></a></li>';
		        	}
		        	
		        	$("#projectList").html(con);
		        	getHash();
		    		getMessageCount();
	        	}else{
	        		//如果没有分店，直接弹出新增分店的弹窗，新增分店成功后关闭弹窗
	        		addProject(0);
	        		$("#msgCount").hide();
	        	}
	        	
	        }
	    })
	}
	//弹出新增分店弹窗
	  function addProject(closeBtn){
		  layui.use(['layer',], function(){
			var layer=layui.layer;
			layer.open({
				  type: 2, 
				  title:"添加新分店",
				  area: ['800px','90%'],
			      shade: [0.6, '#000'],
			      zIndex:800,
			      closeBtn:closeBtn,
				  content:"/app/project/add", 
				  end: function () {
					 location.reload();
			      }
				});	 
			  
		});
		  
	  }
	//获取未读消息数
	function getMessageCount(){
		var url = "/app/message/user/getMsgCount";
		$.post(url,function(result){
			if(result > 0){
				$("#msgCount").text(result);
				$("#msgCount").show();
			}else{
				$("#msgCount").hide();
			}
		   
		  });
	}
	/* 阻止事件冒泡 */
	function preventBubble(event){ //取消事件冒泡
	    var e=arguments.callee.caller.arguments[0]||event; //若省略此句，下面的e改为event，IE运行可以，但是其他浏览器就不兼容  
	    if (e && e.stopPropagation) {  
	      e.stopPropagation();  
	    } else if (event) {  
	      event.cancelBubble = true;  
	    }  
	}
	function setLayBody(){
		$('.layui-body').css("top","0");
		$('.my-header').hide();
		$(".sub-nav-bar1").hide();
	}
</script>
</html>